<!doctype html>
<html>
<head>
<title>修改密码</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=2.0, user-scalable=no, width=device-width">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="assets/css/amazeui.min.css">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body class="body">
<div class="containter">
  <header data-am-widget="header" class="am-header am-header-default">
    <div class="am-header-left am-header-nav">
        <a href="javascript:;"onClick="javascript :history.back(-1);">
          <img src="assets/images/left.png">
        </a>
    </div>
    <h1 class="am-header-title" style="margin:0 14%">
      修改密码
    </h1>
  </header>
  <div style="height: 4rem; width: 100%;"></div>
  <div class="change">
    <ul>
      <li>
        <input type="password" id="oldPsd" placeholder="请输入您的旧密码">
        <a href="javascript:;"  class="close "></a>
      </li>
      <li>
        <input type="password" id="newPsd" placeholder="请输入您的新密码">
        <a href="javascript:;"  class="close"></a>
      </li>
      <li>
        <input type="password" id="verify" placeholder="请再次输入您的新密码">
        <a href="javascript:;"  class="close"></a>
      </li>
    </ul>
    <button id="change_psd">修改密码</button>
    
  </div>
</div>
<div id="toast" style="top:-18.5rem"></div>
<script type="text/javascript"  src="assets/js/jquery-1.9.0.min.js"></script>
<script src="assets/js/allUse.js"></script>
<script src="assets/js/jquery.md5.js"></script>
<script type="text/javascript">
$(function(){
  //登录页面-密码显示
  $(".close").click(function() {
		$(this).toggleClass("close");
		$(this).toggleClass("key");
		if($(this).is('.key')) {
			$(this).parents("li").find("input").attr("type", "text");
		} else {
			$(this).parents("li").find("input").attr("type", "password");
		}
	});
	$("input").on('input propertychange',function(){
		if($("#oldPsd").val() && $("#newPsd").val() && $("#verify").val() && $("#verify").val()===$("#newPsd").val()){//表单全部填过了
			$("#change_psd").addClass("turn-pink");
		}else{
			$("#change_psd").removeClass("turn-pink");
		};
	});
  $("#change_psd").click(function(){
  	var rxpassword = /^[a-zA-Z0-9]{6,18}$/;
  	var oldPsd=$("#oldPsd").val();
  	var newPsd=$("#newPsd").val();
  	var verify=$("#verify").val();
  	var flag=true;
  	if(!newPsd){
  		showToast("请输入新密码");
  		flag=false;
  		return;
  	}else if(!rxpassword.test(newPsd)){
  		showToast("密码长度应为6-18位并且为字母数字组合");
  		flag=false;
  		return;
  	}else if(newPsd!==verify){
  		showToast("两次输入不一致");
  		flag=false;
  		return;
  	}
  	if(flag){
  		$.ajax({
  				type:"post",
  				url:url_enter+"/api/modify_password",
  				headers:headers,
  				data:{
  					"old_password":$.md5($.md5(oldPsd)),
  					"new_password":$.md5($.md5(newPsd))
  				},
  				success:function(data){
  					console.log(data)
  					if(data.result===1){
  						alert(data.message);
  						window.history.back();
  					}else{
  						alert(data.message);
  					}
  				}
  		})
  	}
  })
 })
</script>
</body>
</html>